:root {
    --button-border-radius: 0.25rem;
    --combobox-border-radius: 0.1875rem;
    --textfield-border-radius: var(--combobox-border-radius);
    --table-border-radius: var(--combobox-border-radius);
    --panel-border-radius: var(--combobox-border-radius);
    --tab-border-radius-bottom: 0 0 var(--combobox-border-radius) var(--combobox-border-radius);
    --tab-border-radius-top: var(--combobox-border-radius) var(--combobox-border-radius) 0 0;
    --tab-border-radius-left: var(--combobox-border-radius) 0 0 var(--combobox-border-radius);
    --tab-border-radius-right: 0 var(--combobox-border-radius) var(--combobox-border-radius) 0;
    --dialog-border-radius: 0.3rem;
}

/* this is is a hack class, when we want to inherit background-color but not the immediate parent, but the first non-transparent parent */
.background-inherit {
}

/* ------------ Form "dockables"  ------------ */
.dockableBlockingMask {
    background: black;
    opacity: 0.3;
    z-index: 10000;
}

/* ------------ Other components  ------------ */
.nav-log-panel {
    white-space: nowrap;
    overflow: auto;
    flex: 1 1 auto;
    align-self: stretch;
    text-align: left;

    padding: var(--border-comp-vert-padding) var(--border-comp-horz-padding);
}

.errorLogMessage {
    color: #ff4500;
}

.verticalStretchSeparator {
    border-left: 1px solid var(--panel-border-color);
    margin: 0.1875rem 0;
    padding: 0;
    align-self: stretch;
}

.verticalSeparator {
    border-left: 1px solid var(--panel-border-color);
}

.horizontalSeparator {
    width: 100%;
    border-bottom: 1px solid var(--panel-border-color);
}

.fa-rotate-45 {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}